/**
 * Copyright (C) 2010-2025 Structr GmbH
 *
 * This file is part of Structr <http://structr.org>.
 *
 * Structr is free software: you can redistribute it and/or modify
 * it under the terms of the GNU General Public License as
 * published by the Free Software Foundation, either version 3 of the
 * License, or (at your option) any later version.
 *
 * Structr is distributed in the hope that it will be useful,
 * but WITHOUT ANY WARRANTY; without even the implied warranty of
 * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
 * GNU General Public License for more details.
 *
 * You should have received a copy of the GNU General Public License
 * along with Structr.  If not, see <http://www.gnu.org/licenses/>.
 */

.file-icon svg {
	color: var(--solid-black);
}

.folder-path {
	font-size: 1.5rem;
	line-height: 2rem;
	margin: 2rem .75rem;
}

#folder-contents {
	position: relative;
}

#folder-contents-container select.select-create-type {
	min-width: 100px;
}

#folder-contents .tile .node {
	width: 100px;
	height: 100px;
}

#folder-contents .img-tile .node {
	width: 300px;
	height: 300px;
}

#folder-contents .tile .file-icon {
	height: 48px;
	margin-top: .25rem;
	display: flex;
	align-items: center;
	justify-content: center;
	cursor: pointer;
}

#folder-contents .img-tile .file-icon {
	height: 296px;
	display: flex;
	align-items: center;
	justify-content: center;
	cursor: pointer;
}

#folder-contents .file-icon img.thumbnail {
	max-height: 48px;
	max-width: 48px;
	margin: auto;
}

#folder-contents .tile i.fa {
	font-size: 48px;
}

#folder-contents .tile i.button {
	position: absolute;
	bottom: 4px;
}

#folder-contents .tile img.tn {
	max-width: 64px;
	max-height: 48px;
}

#folder-contents .tile .abbr-ellipsis {
	line-height: 1.5rem;
}

#folder-contents .img-tile img.tn {
	max-width: 220px;
	max-height: 220px;
}

#folder-contents .thumbnail {
	color: var(--gray-aaa);
}

#folder-contents .thumbnailZoom {
	max-width: 300px;
	max-height: 300px;
	position: absolute;
	z-index: 4;
	display: none;
}

#folder-contents tr[id]:hover,
#folder-contents .tile:hover {
	background-color: var(--light-gray-bg-f3) ! important;
}

#folder-contents tr[id] .node-action-icon,
#folder-contents .tile .node-action-icon {
	display: inline-block;
	opacity: 0;
}

#folder-contents tr[id]:hover .node-action-icon,
#folder-contents .tile:hover .node-action-icon {
	opacity: 100%;
}

#folder-contents .nodeActive {
	background-color: var(--light-gray-bg-f3) ! important;
}

#folder-contents .nodeHover, .image.nodeHover {
	color: var(--gray-333) ! important;
	z-index: 1;
}

/*
 * Files table
 */

#files-table th.icon      { width: 24px; }
#files-table th[name]     { width: calc(100% - (24px + 3rem + 5% + 14rem + 14rem + 5% + 10% + 10%)); }
#files-table th[export]   { width: 3rem; }
#files-table th[uuid]     { width: 5%; }
#files-table th[created]  { width: 14rem; }
#files-table th[modified] { width: 14rem; }
#files-table th[size]     { width: 5%; }
#files-table th[type]     { width: 10%; }
#files-table th[owner]    { width: 10% }

#files-table {
	table-layout: fixed;
	margin-bottom: 1rem;
}

#files-table tr:nth-child(even) {
	background-color: var(--main-background);
}

#files-table tr:nth-child(odd) {
	background-color: var(--solid-white);
}

#files-table th {
	padding-bottom: 1rem;
	text-align: left;
}
#files-table th[export] {
	text-align: center;
}

#files-table th,
#files-table td {
	padding-right: 2rem;
}
#files-table th:first-of-type,
#files-table td:first-of-type {
	padding-left: 1rem;
}


#files-table tbody tr td .editable {
	min-width: 100px;
	min-height: 14px;
}

#files-table tbody tr td .editable .placeholder {
	color: var(--inactive-tab-text);
}

#files-table tbody tr td.id_ {
	color: var(--gray-ccc);
}

#files-table tbody tr td .node {
	min-width: 6rem;
}

#files-table td.file-icon {
	cursor: pointer;
}

#files-table td a {
	text-decoration: none;
}

#files-table td a:hover {
	text-decoration: underline;
}

#files-table .file, #files-table .folder {
	margin: 0;
}


/*
 * Upload progress bar
 */

.progress {
	display: none;
	text-align: right;
	position: absolute;
	height: 100%;
	margin: 2px 0 0 0;
	padding: 0;
	background: #ffffff85;
}

.progress .bar {
	background-color: #84ba3985;
	width: 50%;
	height: 100%;
	padding: 0;
	margin: 0;
}

.progress .indicator {
	position: absolute;
	right: .6rem;
	top: .6rem;
}

.file .progress .indicator {
	top: .4rem;
}

.file .progress {
	right: 0;
	top: -.15rem;
	width: 100%;
}

.tile .progress {
	top: calc(100% - 2.5rem);
	left: 0;
	height: 2.5rem;
	width: 100%;
	z-index: 2;
}


/**
 * CSV and XML importer
 */

#csv-import #commit-interval {
	width: 50px;
}

pre.csv-preview {
	overflow: auto;
	background-color: var(--solid-white);
	border: 1px solid var(--gray-ddd);
	height: 100px;
}

.row-container tr:nth-child(odd) {
	background-color: var(--solid-white);
}

.row-container tr:nth-child(even) {
	background-color: var(--light-gray-bg-f7);
}

#row-container tr:nth-child(odd) {
	background-color: var(--solid-white);
}

#row-container tr:nth-child(even) {
	background-color: var(--light-gray-bg-f7);
}

div.attr-mapping table {
	width: 99%;
}

.attr-mapping th {
	padding-bottom: 2px;
}

div.attr-mapping td {
	border: 1px solid var(--gray-ddd);
}

div.attr-mapping td.key {
	padding: 0 8px 0 8px;
}

div.attr-mapping td.transform {
	padding: 1px;
}

div.attr-mapping td.transform input {
	width: calc(100% - 10px);
}

div.attr-mapping select.attr-mapping {
	width: 100%;
}

div#xml-import {
	height: calc(100% - 3rem);
}

table#csv-import,
table#csv-import {
	width: 100%;
}

table#csv-import td {
	padding: 0 0 12px 0;
}

div#types-container div.type-mapping {
	width: 100px;
	float: left;
}

div.xml-mapping, div#config {
	padding: .5rem 1rem;
	height: 100%;
	overflow: auto;
}

div.xml-mapping {
	background-color: var(--solid-white);
	border: 1px solid var(--gray-ddd);
}

div.xml-mapping table {
	width: 100%;
}

div.xml-mapping td {
	cursor: pointer;
}

div.xml-mapping td:hover, div.xml-mapping td.selected {
	background-color: var(--structr-light-green-transparent);
}

div#left {
	float: left;
	width: 45%;
	height: calc(100% - 3rem);
}

div#right {
	float: right;
	width: 55%;
	height: calc(100% - 3rem);}

div#xml-config {
	margin: 0 6px 0 24px;
}

div#xml-config label {
	font-weight: bold;
}

div#xml-config select.xml-config-select {
	width: 45%;
}

button#start-import, button#run-method {
	background-color: var(--structr-green);
}

button#run-method {
	margin-left: 24px;
}

div#xml-config p.hint {
	padding: 48px;
}

div#xml-config label {
	width: 55%;
}

div#csv-configurations,
div#xml-configurations {
	padding: 0;
	margin: 0;
	left: 12px;
	bottom: 12px;
	text-align: left;
}

div#csv-configurations input,
div#xml-configurations input {
	margin-left: 2rem;
}
div#csv-configurations button,
div#xml-configurations button {
	padding-left: 8px;
	margin: 0 0 0 12px;
}


/* start dragndrop classes in files */
.node:hover {
	cursor: pointer;
}

.node.drag-over:not(.drop-not-possible) {
}
.node.drag-background-node-highlight {
	background: var(--hover-highlight-color-active);
}

.node.drag-background-drop-forbidden {
	background-image: var(--striped-background);
	background-size: 20px 20px;
}

.jstree-default .jstree-wholerow.drag-background-node-highlight {
	background: var(--hover-highlight-color-active) ! important;
}

.jstree-default .jstree-wholerow.drag-background-drop-forbidden {
	background-image: var(--striped-background);
	background-size: 20px 20px;
}
/* end dragndrop classes in files */